<ion-content fullscreen class="transparent-header">
  <div [ngClass]="getBaseStyle(isHorizon)">
    <ion-header>
      <ion-navbar>
      </ion-navbar>
    </ion-header>

    <video controls id="lesson_video" [width]="hor_size" [height]="ver_size">
      <source [src]="video_url" type="video/mp4" />
    </video>

    <!--<div class="play-bar" [ngStyle]="getPlayBarStyle()">
      <button ion-button small icon-only clear color="white" (click)="onVideoPlay()">
        <ion-icon [name]="video_control.play"></ion-icon>
      </button>

      <ion-range class="vol-range" min="0" max="100" step="1" [(ngModel)]="video_control.volume" (ionChange)="onRangeChanged(1, $event)">
        <ion-icon range-left small name="volume-down" color="white">0</ion-icon>
        <ion-icon range-right small name="volume-up" color="white">100</ion-icon>
      </ion-range>

      <ion-range class="vol-range" min="0" [max]="video_control.duration" step="1"
                 [(ngModel)]="video_control.currentTime" (ionChange)="onRangeChanged(2, $event)">
        <ion-icon range-left small name="volume-down" color="white">0</ion-icon>
        <ion-icon range-right small name="volume-up" color="white">{{video_control.duration}}</ion-icon>
      </ion-range>

      <button ion-button icon-only clear color="white" (click)="onChangeScreen()">
        <ion-icon [name]="video_control.full"></ion-icon>
      </button>
    </div>-->
  </div>
</ion-content>
